<template>
<el-container id="contain" :style="{height:height+'px'}">
  <el-header>
    <myhead></myhead>
  </el-header>
  <el-container>
    <el-aside width="200px">
      <myLeftTree></myLeftTree>
    </el-aside>
    <el-main>
        <router-view/>
    </el-main>
  </el-container>
  <el-footer>Footer</el-footer>
</el-container>
</template>


<script>
import myhead from "@/pages/head";
import myLeftTree from '@/pages/leftTree'
import cusadd from '@/pages/cusadd'
export default {
  name: "home",
  components: {
    myhead,
    myLeftTree,
    cusadd
  },
  data() {
    return {
      height: 0
    };
  },
  mounted() {
    this.height = window.innerHeight;
  },
  created() {
    window.addEventListener("resize", function() {
      this.height = window.innerHeight;
    });
  }
  // methods: {
  //     gitWindowHight(){
  //         this.height = window.innerHeight;
  //         return this.height + "px"
  //     }
  // },
};
</script>

<style>
#contain {
  height: 100%;
}
.el-header,
.el-footer {
  /* background-color: #b3c0d1;
  color: #333; */
  text-align: center;
  line-height: 100px;
}

.el-aside {
  /* background-color: #d3dce6; */
  color: #333;
  text-align: center;
  line-height: 200px;
}


</style>